<%@ page import="eduboat.comm.util.Tool" %>
<%@page contentType="text/html; charset=utf-8" %>
<%-- 
/**
 * 创建信息
 * ============= jsp名: /work/admin/xtgl/dict/dict_options.jsp
 * 页面作用描述:  数据字典明细的新增、修改、删除
 * 创建人：zhongjianjun
 * 创建时间： 2013-1-18 
 * 修改信息1=============
 * 修改类型: //1.修改bug 2.业务变化修改 
 * 修改描述: 
 * 修改人： zhongjianjun
 * 修改时间：2013-1-24
 */
 --%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>智慧校园-后台管理系统</title>
		<%@include file="/comm/jsp/public.jsp" %>
		<!--通用css-->
		<link rel="stylesheet" type="text/css" media="all" href="<%=path%>/work/comm/css/common.css" />
		<!--通用js-->
		<script type="text/javascript" src="<%=path%>/work/comm/js/public.js"></script>
		<!--树形css-->
		<link rel="stylesheet" type="text/css" media="all" href="<%=path%>/comm/plug/tree/css/zTreeStyle/zTreeStyle.css" />
		<!--树形基本js-->
		<script type="text/javascript" src="<%=path%>/comm/plug/tree/js/jquery.ztree.core-3.5.js"></script>
		<script type="text/javascript" src="<%=path%>/comm/plug/tree/js/jquery.ztree.excheck-3.5.js"></script>
		<!--表单验证css-->
		<link rel="stylesheet" href="<%=path%>/comm/plug/validateform/validationEngine.jquery.css" type="text/css"/>
		<!--表单验证js-->
		<script src="<%=path%>/comm/plug/validateform/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
		<script src="<%=path%>/comm/plug/validateform/jquery.validationEngine-zh_CN.js" type="text/javascript" charset="utf-8"></script>

		<style> 
			body{min-width:100px;}
		</style>
		<script type="text/javascript">
			//全局变量
			var dictSn = art.dialog.data("dict_sn"); //字典流水号
			var opt_type; // 1-新增操作   2-修改操作 3-新增根节点的子节点
			var setting = { //树的初始化设置
					data: { simpleData: {enable: true} },
					callback: { onClick: onSelect }
				};
			var zNodes; // 生成一棵树的节点集合
			var selectNode; // 选中的节点
			
			//ajax字段验证：验证选项编码的唯一性
		    $.validationEngineLanguage.allRules["ajaxDictDetailCodeCall"] = {
				"url": "<%=path%>/work/admin/xtgl/json/dict_detail_opt_checkOptionId.action",
				"extraDataDynamic":["#dict_detail\\.option_id_temp","#dict_detail\\.dict_sn"],
		        "alertText": "* 此选项编码已存在",
		        "alertTextLoad": "* 正在验证选项编码唯一性...",
		        "alertTextOk": "* 此选项编码可用"
		 	};
			
			//初始化树
			$(function(){
				$("#dict_detail\\.dict_sn").val(dictSn);
				if(dictSn!=null && dictSn!=''){
					ajaxOtherCall({
						 url : "<%=path%>/work/admin/xtgl/json/dict_detail_opt_find.action", //访问页面
						 async : false,
						 data :{"dict_sn":$.trim(dictSn)},
				         _callBackOK : loadDictDetailCallBack
					});
				}
				var zTree=$.fn.zTree.init($("#options"), setting, zNodes);
				doSelect(searchNodeById(0)); //模拟鼠标点击选中根节点
				
				//为表单注册验证
				$("#dictDetailForm").validationEngine({
					ajaxFormValidation: true,
					ajaxFormValidationMethod: 'post',
					ajaxFormValidationURL:"<%=path%>/work/admin/xtgl/json/dict_detail_opt_checkForm.action",
					onAjaxFormComplete: ajaxValidationCallback
		   		});
		   		$("#dictDetailForm").hide();
			    $("#tps").show();
			}); 
			
			//ajax表单验证回调函数
			function ajaxValidationCallback(status, form, json, options){
				if(status === true) {
					saveDictDetail();
				}
			}
			
			//查询字典项明细的回调函数
			function loadDictDetailCallBack(data){
		       var list =  data.dictDetailList;
		       var dict_name;
				for(var i in list){
		       	  	list[i].id=list[i].option_sn;
		       	  	list[i].pId=list[i].parent_code;
		       	  	list[i].name=list[i].option_name;
		       	  	list[i].option_id_temp=list[i].option_id;
		       	  	if(list[i].option_sn==0){
		       	  		list[i].isParent=true;list[i].open=true;
		       	  		dict_name=list[i].option_name;
		       	  	}
		       	}
				zNodes=list;
		       $("#dctName").html(dict_name);
		       //$("#addrtbtn").val("新增<"+dict_name+">的子节点");
		       $("#tps").html("点击【"+$("#addrtbtn").val()+"】按钮新增 "+dict_name+" 的子节点!");
			}
			
			//点击了保存按钮，保存数据字典明细
			function saveDictDetail(){
				var optionSn = selectNode.option_sn;
			    var parentCode = optionSn;
			    if(opt_type==1){ //点击了新增按钮
			    	optionSn=0;
			    }
			    if(opt_type==2){ //修改
			    	parentCode=selectNode.parent_code;
			    }
			    if(opt_type==3){ //新增根节点的子节点
			    	optionSn=0;
			    	parentCode=0;
			    }
			    ajaxOtherCall({
					 url : "<%=path%>/work/admin/xtgl/json/dict_detail_opt_save.action", //访问页面
					 data :{"dict_detail.option_sn": $.trim(optionSn),
							"dict_detail.dict_sn": $.trim(dictSn),
							"dict_detail.dict_code": $.trim(selectNode.dict_code),
							"dict_detail.option_id": $.trim($("#dict_detail\\.option_id").val()),
							"dict_detail.option_name": $.trim($("#dict_detail\\.option_name").val()),
							"dict_detail.level_seq": $.trim($("#dict_detail\\.level_seq").val()),
							"dict_detail.parent_code": $.trim(parentCode),
							"dict_detail.level_index": $.trim(selectNode.level_index),
							"dict_detail.fomcat": $.trim(selectNode.fomcat),
							"dict_detail.is_leaf": $.trim(selectNode.is_leaf),
							"dict_detail.is_move": $.trim(selectNode.is_move),
							"dict_detail.option_id_temp": $.trim(selectNode.option_id_temp)},
			         _callBackOK : saveDictDetailCallBack
				});
			}
			
			//保存成功回调函数
			function saveDictDetailCallBack(data){
				art.dialog.alert("操作成功！！！", function(){
					//更新树
					var node=data.dict_detail;
					node.id=node.option_sn;
		       	  	node.pId=node.parent_code;
		       	  	node.name=node.option_name;
		       	  	node.option_id_temp=node.option_id;
					if(opt_type==1 || opt_type==3){//新增
						addnode(node);
					}
					if(opt_type==2){//修改
						updatenode(node);
					}
					doSelect(searchNodeById(node.option_sn)); //模拟鼠标点击选中刚被选择的节点
				},"succeed");
			}
			
			//点击了删除按钮，删除字典明细
		 	function delDictDetail(){
		 		if(selectNode.isParent){
					art.dialog.alert("该节点下面还有子节点，不能删除该节点");return;
				}
		 		art.dialog.confirm("删除后不可恢复，你确认删除该记录吗？", function(){
		 			ajaxOtherCall({
						 url : "<%=path%>/work/admin/xtgl/json/dict_detail_opt_del.action", //访问页面
						 data :{"dict_detail.fomcat": selectNode.fomcat},
				         _callBackOK : delDictDetailCallBack
					});
				});
		 	}
		 	
			//删除成功回调函数
			function delDictDetailCallBack(data){
				art.dialog.alert("删除成功！！！", function(){
					var nextNode=searchNodeById(selectNode.option_sn).getNextNode();
					var prevNode=searchNodeById(selectNode.option_sn).getPreNode();
					var parentNode=searchNodeById(selectNode.option_sn).getParentNode();
					//刷新树
					delNodeById(selectNode.option_sn);
					if(parentNode.id==="0"){
						parentNode.isParent=true;
					}
					var sNode = nextNode==null?prevNode:nextNode;
					var tempNode = sNode==null?parentNode:sNode;
					doSelect( tempNode );
					updatenode(tempNode);
				},"succeed");
			}
		 	
			//点击了新增子节点按钮
			function addSubNodeBtn(type){
				$("#dict_detail\\.option_id").val("");
				$("#dict_detail\\.option_name").val("");
				$("#dict_detail\\.level_seq").val("");
				$("#dict_detail\\.option_id_temp").val("");
				$("#savBtn, #delBtn, #addBtn").show(); //隐藏之前先全部显示
				$("#addBtn, #delBtn").hide();
				$("#dictDetailForm").show();
			    $("#tps").hide();
				opt_type=type;
				if(type===3){
					$.fn.zTree.getZTreeObj("options").selectNode(searchNodeById(0));
				}
			}
			
			//树的节点被选中触发的回调函数
			function onSelect(event, treeId, treeNode){
				selectNode=treeNode;
				opt_type=2; //重置操作类型为 修改 操作
				if(selectNode.option_sn==0){//选择了根节点
					//隐藏之前先全部显示
					$("#savBtn, #delBtn, #addBtn").show();
					$("#savBtn, #delBtn").hide();
					$("#dictDetailForm").hide();
			    	$("#tps").show();
				}else{
					$("#savBtn, #delBtn, #addBtn").show();
					$("#dictDetailForm").show();
			    	$("#tps").hide();
				}
				$("#dictDetailForm").validationEngine("hide");
				$("#dict_detail\\.option_id").val($.trim(treeNode.option_id));
				$("#dict_detail\\.option_name").val($.trim(treeNode.name));
				$("#dict_detail\\.level_seq").val($.trim(treeNode.level_seq));
				$("#dict_detail\\.option_id_temp").val($.trim(treeNode.option_id));
			    if(treeNode.id==0){
					$("#dict_detail\\.option_name").val("");
				}
			}
		
			//根据id查找节点
			 function searchNodeById(id){
				var zTree = $.fn.zTree.getZTreeObj("options");
				nodeList = zTree.getNodesByParam("id",id);
				return nodeList[0];
			 }
			 //删除节点
			 function delNodeById(id){ 			 
				$.fn.zTree.getZTreeObj("options").removeNode(searchNodeById(id));
			 }
			 //添加节点
			 function addnode(newnode){
				var parentnode=searchNodeById(newnode.pId);
				var zTree = $.fn.zTree.getZTreeObj("options");
				zTree.addNodes(parentnode,newnode,false);
			 }
			 //更新节点
			 function updatenode(node){
				var node_new=searchNodeById(node.id);
				jQuery.extend(node_new,node);
				$.fn.zTree.getZTreeObj("options").updateNode(node_new);
			 }
			 function doSelect(node) { // 模拟鼠标点击选中节点node
			    $.fn.zTree.getZTreeObj("options").selectNode(node); 
			    $(node).trigger('click'); 
			    $(".curSelectedNode").trigger('click'); 
			}
		</script>
	</head>
	<body>
		<!--学校信息-->
		<div class="bz_div" style="width: 650px; margin-top: 10px">
			<div class="bz_tit">
				<div style="margin-left: 10px;">
					数据字典编辑信息
				</div>
			</div><!-- .bz_tit -->
			<div class="section" style="margin-top: 10px">
				<ul class="tabs">
					<li>
						<a href="<%=path%>/work/admin/xtgl/dict/dict_detail.jsp">数据字典</a>
					</li>

					<li class="current">
						<a href="<%=path%>/work/admin/xtgl/dict/dict_options.jsp">字典明细</a>
					</li>
				</ul>
			</div><!-- .section -->
			<!--树-->
			<div style="width: 200px; float: left; border-right-color: #CCCCCC; border-right-style: solid; border-right-width: 5px; border-left-width: 0px;">
				<!--初始化信息-->
				<div class="bz_div" style="width: 98%; margin-top: 0px">
					<div class="bz_tit">
						<div id="dctName" style="margin-left: 10px;"></div>
					</div><!-- .bz_tit -->
					<div class="bz_cont">
						<div id="capt_div">
							<div style="width: 100%; text-align: left">
								<input id="addrtbtn" type="button" value="新增顶层子节点"
									style="width: 150px" class="inputOver"
									onclick="addSubNodeBtn(3)" />
							</div>
							<ul id="options" class="ztree"></ul>
						</div><!-- .capt_div -->
					</div><!-- .bz_cont -->
				</div><!-- .bz_div -->
				<!--初始化信息 end-->
			</div>
			<!--树 end-->

			<!--编辑信息strat-->
			<div class="" style="margin-top: 0px; float: left;">
				<div class="bz_tit">
					<div style="margin-left: 10px;">
						节点明细
					</div>
				</div>
				<div class="bz_cont">
					<form id="dictDetailForm">
						<input type="hidden" id="dict_detail.dict_sn" name="dict_detail.dict_sn" />
						<input type="hidden" id="dict_detail.option_id_temp" name="dict_detail.option_id_temp" />
						<table class="datadesr"
							style="width: 380px; margin-top: 5px; margin-bottom: 10px">
							<tr>
								<th style="width: 80px; text-align: right">
									选项编码：
									<span class="red">*</span>
								</th>
								<td style="width: 250px;">
									<input id="dict_detail.option_id" name="dict_detail.option_id"
										class="inp validate[required, maxSize[100],custom[onlyLetterNumber], ajax[ajaxDictDetailCodeCall]]" />
								</td>
							</tr>
							<tr>
								<th style="width: 80px; text-align: right">
									选项名称：
									<span class="red">*</span>
								</th>
								<td style="width: 250px;">
									<input id="dict_detail.option_name"
										name="dict_detail.option_name" class="inp validate[required, maxSize[200]]" />
								</td>
							</tr>

							<tr>
								<th style="width: 80px; text-align: right">
									选项顺序：
									<span class="red">*</span>
								</th>
								<td style="width: 250px;">
									<input id="dict_detail.level_seq" name="dict_detail.level_seq"
										class="inp validate[required,custom[integer],min[1]]" />
								</td>
							</tr>
						</table><!-- .datadesr -->
						<div style="width: 100%; text-align: center; margin-top: 5px; margin-bottom: 5px">
							<input id="savBtn" type="submit" value="保存" class="inputOver"
								style="width: 60px" />
							<input id="addBtn" type="button" value="新增子节点" class="inputOver"
								style="width: 80px; margin-left: 20px"
								onclick="addSubNodeBtn(1)" />
							<input id="delBtn" type="button" value="删除" class="inputOver"
								style="width: 80px; margin-left: 20px" onclick="delDictDetail()" />
						</div>
					</form>
					<div id="tps" style="width: 380px; text-align: center; padding-top: 25px;"></div>
				</div><!-- .bz_cont -->
				<!--编辑信息 end-->
			</div>
		</div><!-- .bz_div -->
	</body>
</html>


